Adding C1TileView to the Application

In this topic we add a C1TileView control to your application. Complete the following steps that are noted where they differ between WPF and Silverlight:

From the Visual Studio File menu, select New and choose Project.

In the New Project dialog box, choose a language from the left-side menu. From the Framework drop-down list, choose .NET Framework 4 and enter a name for the project.

Note: If the C1TileView control is installed in the Visual Studio Toolbox, you can drag the control onto a page to automatically perform the rest of the steps.

In the Solution Explorer, right-click the project name and choose Add Reference. In the Add Reference dialog box, locate and select the following assemblies and click OK to add references to your project:
- C1.WPF or C1.Silverlight
- C1.WPF.TileView or C1.Silverlight.Tileview

Open the WPF MainWindow.xaml file (or MainPage.xaml in Silverlight) and in the XAML view, add the XAML namespace to the WPF Window class (or UserControl in Silverlight) with the following markup:

XAML	Copy Code
xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml"

The WPF Window class (or UserControl in Silverlight) appears similar to the following:

In the WPF MainWindow.xaml file

WPF XAML	Copy Code
<Window x:Class="MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525">

WPF XAML

Copy Code

<Window x:Class="MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">

In the Silverlight MainPage.xaml file

Silverlight XAML	Copy Code
<UserControl x:Class="QuickStart.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400">

Silverlight XAML

Copy Code

<UserControl x:Class="QuickStart.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" 
    mc:Ignorable="d" 
    d:DesignHeight="300" 
    d:DesignWidth="400">

This is a unified namespace that lets you work with most ComponentOne WPF or Silverlight controls without adding multiple namespaces.

Add the <c1:C1TileView x:Name="C1TileView1" /> element within the Grid element on the page to add the C1TileView control to the application.
The XAML appears similar to the following:

XAML	Copy Code
<Grid x:Name="LayoutRoot" Background="White"> <c1:C1TileView x:Name="C1TileView1" /> </Grid>

This adds a C1TileView control named "C1TileView1" to the application.

What You've Accomplished

You've successfully set up your application's user interface, but if you run your application now, the C1TileView control has no content. See the Adding Items to C1TileView topic for more information.